import React from 'react';
import { Row, Col, Form, Input, Button, DatePicker, InputNumber } from 'antd';
import PartSelect from '@/components/PartSelect';
import moment from 'moment';
import {
  OpMasterSelect,
  VendorSelect,
} from '@/components/FormItemSelect';

const FormItem = Form.Item;

const formLayout = {
  labelCol: { span: 6 },
  wrapperCol: { span: 14 },
};

export default class UpdateForm extends React.Component<any, any> {
  formRef: any = React.createRef();
  handleSubmit = (values: any) => {
    const { onSubmit, eType } = this.props;
    values.venPartNum = "0";
    values.priceFormat = "0";
    values.pricePerCode = eType ? eType : "MTL";
    values.opCode = !values.opCode ? "0" : values.opCode;
    if (typeof onSubmit === 'function') {
      onSubmit(values);
    }
  };
  setCurrent = (part?: any) => {
    var PartBOM: any = {};
    PartBOM.partNum = part.partNum;
    PartBOM.partDescription = part.partDescription;
    PartBOM.pum = part.ium;
    this.formRef.current.setFieldsValue(PartBOM);
  };
  componentDidMount() {
    const { formVals } = this.props;
    if (formVals) {
      if (formVals.effectiveDate) {
        formVals.effectiveDate = moment(formVals.effectiveDate)
      }
      if (formVals.expirationDate) {
        formVals.expirationDate = moment(formVals.expirationDate)
      }
      this.formRef.current.setFieldsValue(formVals);
    }
  }
  formRender = () => {
    return (
      <Form {...formLayout} ref={this.formRef} onFinish={this.handleSubmit}>
        <Row gutter={16}>
          <Col span={24}>
            <Form.Item label="物料编码">
              <Input.Group compact>
                <PartSelect
                  name="partNum"
                  noStyle
                  width={200}
                  required={true}
                  placeholder="物料编码"
                  setCurrent={this.setCurrent}
                />
              </Input.Group>
            </Form.Item>
            <FormItem name="id" label="ID" hidden>
              <Input />
            </FormItem>
            <FormItem name="partDescription" label="物料名称">
              <Input.TextArea placeholder="请输入物料名称" disabled />
            </FormItem>
            <FormItem name="pum" label="单位">
              <Input placeholder="请输入单位" disabled />
            </FormItem>
            <FormItem name="effectiveDate" label="生效日期">
              <DatePicker />
            </FormItem>
            <FormItem name="expirationDate" label="失效日期">
              <DatePicker />
            </FormItem>
            <OpMasterSelect
              width={200}
              labelInValue={false}
              required={false}
              showSearch
              name='opCode'
              label="工序"
              hidden={this.props.eType != "SUB"}
            />
            <VendorSelect
              required={true}
              showSearch={true}
              width={200}
              name='vendorNum'
              label="供应商"
            />
            <FormItem name="baseUnitPrice" label="基本单价">
              <InputNumber placeholder="请输入基本单价" min={0} />
            </FormItem>
          </Col>

          <Col span={24} style={{ display: 'flex', justifyContent: 'center' }}>
            <Button type="primary" htmlType="submit">
              确认
            </Button>
          </Col>
        </Row>
      </Form>
    );
  };
  render() {
    const FormRender = this.formRender;
    return <FormRender />;
  }
}
